@CHARSET "UTF-8";

/*!
 * =================================
 * New Page Style
 * @author: mylan93@163.com
 * =================================
 */

/* ! Style Check List
 * =================================
 * Utility
 * ====================
 * Header
 * ====================
 * Component
 * ====================
 * Page
 * =================================
 */

/*
 * =================================
 *  Utility
 * =================================
 */
* {
  font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
}

/* @font-face {
  font-family: 'iconfont';  project id 848145
  src: url('//at.alicdn.com/t/font_848145_cpbj7d94hla.eot');
  src: url('//at.alicdn.com/t/font_848145_cpbj7d94hla.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_848145_cpbj7d94hla.woff') format('woff'),
  url('//at.alicdn.com/t/font_848145_cpbj7d94hla.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_848145_cpbj7d94hla.svg#iconfont') format('svg');
} */
/* @font-face {
  font-family: 'iconfont'; project id 994076
  src: url('//at.alicdn.com/t/font_994076_19kl283swwqh.eot');
  src: url('//at.alicdn.com/t/font_994076_19kl283swwqh.eot?#iefix')
    format('embedded-opentype'),
    url('//at.alicdn.com/t/font_994076_19kl283swwqh.woff2')
    format('woff2'),
    url('//at.alicdn.com/t/font_994076_19kl283swwqh.woff') format('woff'),
    url('//at.alicdn.com/t/font_994076_19kl283swwqh.ttf')
    format('truetype'),
    url('//at.alicdn.com/t/font_994076_19kl283swwqh.svg#iconfont')
    format('svg');
} */
@font-face {
  font-family: 'iconfont';  /* project id 994076 */
  src: url('//at.alicdn.com/t/font_994076_sv8detk2fec.eot');
  src: url('//at.alicdn.com/t/font_994076_sv8detk2fec.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_994076_sv8detk2fec.woff2') format('woff2'),
  url('//at.alicdn.com/t/font_994076_sv8detk2fec.woff') format('woff'),
  url('//at.alicdn.com/t/font_994076_sv8detk2fec.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_994076_sv8detk2fec.svg#iconfont') format('svg');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* .icon-shoes:before {content: "\e602";} */
.icon-wechat:before {
  content: "\e62f";
}

.icon-phone:before {
  content: "\e653";
}

.icon-captcha:before {
  content: "\e624";
}

.icon-pay-success:before {
  content: "\e61e";
}

.icon-money:before {
  content: "\e632";
}

.icon-calendar:before {
  content: "\e672";
}

.icon-bill:before {
  content: "\e633";
}

.icon-edit:before {
  content: "\e66b";
}

.icon-time:before {
  content: "\e66c";
}

.icon-date:before {
  content: "\e66d";
}

.icon-user:before {
  content: "\e65f";
}

.icon-wallet:before {
  content: "\e611";
}

.icon-gender:before {
  content: "\e645";
}

.icon-add-account:before {
  content: "\e61a";
}

.icon-share:before {
  content: "\e655";
}

.icon-camera:before {
  content: "\e619";
}

.bg-light-gray {
  background: #eeeeee;
}

.bg-white {
  background: #ffffff;
}

.clearfix {
  *zoom: 1;
}

.clearfix:before, .clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}

.clearfix:after {
  clear: both;
}

.color-red {
  color: #CD2233 !important;
}

.color-blue {
  color: #469d26 !important;
}

.no-margin {
  margin: 0px;
}

.hide {
  display: none !important;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.img-style {
  display: block;
  width: 100%;
}

.buttons-fixed {
  position: fixed;
  z-index: 99;
  width: 100%;
}

/*
 * =================================
 *  Component - Label
 * =================================
 */
.fb-label {
  padding: 0 .2rem;
  height: 1.4rem;
  line-height: 1.4rem;
  color: #fff;
  font-size: .6rem;
  text-align: center;
  border-radius: .25rem;
  border: 1px solid #d11b28;
  background: #d11b28;
}

.audit-label {
  color: #ff4e00;
  background: transparent;
}

/*
 * =================================
 *  Component - Button
 * =================================
 */
.fb-button {
  color: #fff;
  border-radius: 2.4rem;
  border-color: #fff;
}

.fb-button, .fb-button:active {
  color: #fff;
  border-color: #fff;
}

.fb-footer {
  padding: 0;
}

.fb-footer .button {
  top: 0;
  color: #fff;
  border-radius: 0;
  border: none;
  background: #CD2233;
}

/*
 * =================================
 *  Component - Tab
 * =================================
 */
.fb-tab .button {
  height: 2.4rem;
  line-height: 2.4rem;
  color: #d11b28;
  border: 1px solid #d11b28;
}

.fb-tab .button.active {
  color: #fff;
  background: #d11b28;
  border: 1px solid #d11b28;
}

.fb-tab.buttons-fixed {
  width: auto;
  left: .5rem;
  right: .5rem;
}

/*
 * =================================
 *   Header
 * =================================
 */
.fb-header {
  color: #fff;
  background: #d11b28;
}

.fb-header .icon {
  color: #fff;
}

.fb-header .title {
  position: absolute;
  display: block;
  width: 60%;
  padding: 0;
  margin: 0;
  font-size: 0.85rem;
  font-weight: 500;
  line-height: 2.2rem;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  left: 50%;
  margin-left: -30%;
}

.fb-header ~ .content {
	top: 2.8rem;
}

/*
 * =================================
 *  Page
 * =================================
 */
.index-page {
  background: url(../images/index-bg.png) no-repeat;
  background-size: cover;
}

.index-page .bet-title {
	margin: 0 auto 2.2rem;
	padding: .5rem 0;
	width: 60%;
	background: url(../images/welcome-text-bg.png) no-repeat;
  background-size: 100% 100%;
}

.index-button-layout {
  position: absolute;
  bottom: 12%;
  width: 100%;
  text-align: center;
}

.index-button-layout .button {
	display: inline-block;
	width: 7rem;
	line-height: 2.2rem;
	height: 2.2rem;
	margin: 0 .25rem;
	box-sizing: border-box;
}

.index-page .join-button, .index-page .join-button:active {
	color: #d11b28;
  background: #fff;
  border-color: #fff;
}

.has-img-header {
	padding-top: .35rem;
	height: 2.8rem;
}

.has-img-header.fb-header {
  background: #eee;
}

.has-img-header .logo img, .has-img-header .user-cover img {
  margin-top: .3rem;
  display: block;
  height: 1.8rem;
}

.has-img-header .user-cover img {
  border-radius: 100%;
  border: 1px solid #d11b28;
}

.has-img-header.fb-header .title img {
  display: block;
  height: 1.2rem;
  margin: .5rem auto;
}

.activity-page .activity-header {
  position: relative;
  margin: .5rem;
}

.index-activity-header {
  padding: .75rem;
  height: 8rem;
  color: #fff;
  font-size: 1rem;
  border-radius: .25rem;
  background: url(../images/index-activity-cover.png) no-repeat;
  background-size: cover;
  box-shadow: 0 5px 10px 0px #a1a1a1;
}

.index-activity-header p {
  margin: 0 auto;
  line-height: 1.3;
}

.activity-introduction-title {
  margin: 0 auto;
  padding: 2px .25rem;
  display: block;
  width: 5rem;
  font-size: .85rem;
  font-weight: bold;
  color: #333;
  text-align: center;
  border: 1px solid #333;
  border-bottom: 3px solid #d11b28;
  box-sizing: border-box;
}

.activity-page .activity-header .time {
  position: absolute;
  top: 35%;
  left: 5%;
  color: #fff;
  font-size: 1.2rem;
}

.index-activity-header .time {
  top: auto !important;
  bottom: .5rem;
  left: 5%;
  font-weight: 200;
  font-size: .7rem !important;
}

.activity-introduction .activity-bonus .number, .bet-rule-page .activity-bonus .number,
  .detail-page .activity-bonus .number {
  margin-top: 1rem;
  font-size: .75rem;
  color: #434343;
  vertical-align: middle;
}

.activity-introduction .activity-bonus .price, .bet-rule-page .activity-bonus .price,
  .detail-page .activity-bonus .price, .activity-bonus .price {
  display: inline-block;
  margin: 1rem auto .5rem;
  color: #ff4e00;
  font-size: 1.7rem;
}

.activity-introduction .activity-bonus .price .item, .bet-rule-page .activity-bonus  .price .item,
  .detail-page .activity-bonus .price .item, .activity-bonus .price .item
  {
  display: block;
  float: left;
  padding: 0;
  margin: 0 3px;
  width: 1.8rem;
  color: #fff;
  text-align: center;
  border-radius: .25rem;
  background: url(../images/bonus-bg.png) no-repeat !important;
  background-size: 100% 100% !important;
}

.activity-introduction .activity-bonus .number .item, .bet-rule-page .activity-bonus .number .item,
  .detail-page .activity-bonus .number .item, .activity-bonus .number .item
  {
  padding: 2px 4px;
  margin: 0 1px;
  color: #fff;
  border-radius: .25rem;
  background: #434343;
}

.bet-rule-page .bonus, .bet-detail-page .bonus {
  position: relative;
  padding-left: .75rem;
  padding-right: .75rem;
  margin-top: 1rem;
}

.bet-detail-page .bonus {
  margin-top: 1rem;
}

.bet-rule-page .support-button-layout {
  margin-bottom: 1.5rem;
  margin-left: -.75rem;
  margin-right: -.75rem;
}

.support-button-layout .support-button {
  float: left;
  display: block;
  width: 49%;
  height: 2rem;
  line-height: 2rem;
  border-radius: 2rem;
  color: #fff;
  border: 1px solid transparent;
  background: url(../images/support-btn-bg.png) repeat-x;
  border-color: #ff4e00;
  background-size: contain;
}

.support-button-layout .nonsupport-button {
  margin-left: 2%;
  color: #fff;
  background: url(../images/nonsupport-btn-bg.png) repeat-x;
  background-size: contain;
  border-color: transparent;
}

.support-button-layout .disabled {
  background-images: none;
  background: #b5b5b5;
}

.support-button-layout .support-button.active::before {
  content: '';
  position: absolute;
  top: 50%;
  left: .75rem;
  margin-top: -.2rem;
  display: block;
  width: .4rem;
  height: .4rem;
  border-radius: 100%;
  background: #fff;
}

.bet-detail-page .support-button.active {
  width: 100%;
  height: 2rem;
  line-height: 2rem;
  border-radius: 2rem;
  color: #fff;
  background: #999999;
  border-color: #fff;
}

.support-button.active span {
  display: inline-block;
  margin-right: .25rem;
  width: .25rem;
  height: .25rem;
  vertical-align: middle;
  border-radius: 100%;
  background: #fff;
}

.bet-rule-page .progress, .bet-detail-page .progress, .detail-page .progress
  {
  margin: .25rem 0 0;
  font-size: .7rem;
}

.landing-page .progress {
	position: relative;
	margin-top: .5rem;
	font-size: .6rem;
}

.bet-rule-page .progress-text, .bet-detail-page .progress-text,
  .detail-page .progress-text,
  .landing-page .progress-text {
  position: relative;
  font-weight: bold;
}


.bet-rule-page .progress-bar, .bet-detail-page .progress-bar,
  .detail-page .progress-bar {
  position: relative;
  color: #333;
  overflow: hidden;
}

.progress-bar {
  position: relative;
  width: 100%;
  height: 1.2rem;
  border: 1px solid #ff0000;
  border-radius: 1.2rem;
  /* background: url(../images/progress.png); */
  background: #000000;
  background-size: contain;
}

.progress-bar .progress-bg {
  position: absolute;
  top: 0;
  left: -1px;
  bottom: 0;
  width: 80%;
  border-top-left-radius: .6rem;
  border-bottom-left-radius: .6rem;
  background: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(0, #ff0000),
    color-stop(100%, #d11b28));
  background: -webkit-linear-gradient(left, #ff0000 0, #d11b28 100%);
  background: linear-gradient(to right, #ff0000 0, #d11b28 100%);
}

.landing-page .progress-bar {
	position: relative;
	height: 1.2rem;
	border-color: #fff;
}

.landing-page .progress-text {
  position: absolute;
  left: .5rem;
  right: .5rem;
  font-weight: bold;
  z-index: 11;
  line-height: 1.2rem;
}

.landing-page .progress-bar .progress-bg {
	background: #7d0000;
	left: 0;
}

.bet-rule-page .supporter-box, .bet-detail-page .supporter-box,
.detail-page .supporter-box, .supporter-layout .supporter-box {
  margin: .75rem 0 1rem;
  display: inline-block;
  width: 9.5rem;
  height: 1.8rem;
  border-radius: 1.8rem;
  border: 1px solid transparent;
}

.supporter-layout .supporter-box {
	width: auto;
	border: 1px solid transparent;
	transition: border 2s;
  -moz-transition: border 2s;	/* Firefox 4 */
  -webkit-transition: border 2s;	/* Safari 和 Chrome */
}

.supporter-layout .content-item {
	padding-right: .5rem;
	display: none;
	opacity: 0;
}


.supporter-layout .user-cover {
  margin-left: -1px;
  width: 1.7rem;
  line-height: 1.7rem;
  vertical-align: middle;
  font-size: .65rem;
  border-radius: 100%;
  border: 1px solid #d11b28;
}

.video-layout {
  margin: 1rem 0;
  box-shadow: 0px 10px 10px -3px rgba(63, 63, 63, 0.1)
}

.no-shadow {
  box-shadow: none;
}

.video-layout .video-header {
  display: block;
  position: relative;
  padding: .75rem;
  border-top-left-radius: .25rem;
  border-top-right-radius: .25rem;
  line-height: 1;
  font-size: 1.8rem;
  font-weight: bold;
  color: #000;
  background: #fff;
}

.has-border-header {
  border-bottom: .15rem solid #d11b28;
}

.video-layout .video-content {
  border-bottom-left-radius: .25rem;
  border-bottom-right-radius: .25rem;
}

.activity-introduction img {
  display: block;
}

.activity-introduction, .bet-rule-page .rule-layout, .bet-detail-page .rule-layout
  {
  padding: 0 .5rem;
  color: #333333;
}

.activity-introduction .block-title, .bet-rule-page .rule-layout .block-title,
  .bet-detail-page .rule-layout .block-title {
  margin-top: .75rem;
  margin-bottom: .5rem;
  color: #d11b28;
  font-weight: bold;
}

.activity-introduction .block-title img, .bet-rule-page .rule-layout img,
  .bet-detail-page .rule-layout img {
  display: inline-block;
  width: 1.5rem;
  margin-right: .5rem;
  vertical-align: middle;
}

.activity-introduction .description, .bet-rule-page .rule-layout .description,
  .bet-detail-page .rule-layout .description {
  font-size: .7rem;
  color: #000000;
}

.activity-introduction .step-layout .step-name small {
	color: rgba(51,51,51,.6);
}

.bet-rule-page .challenger-cover, .open-page .challenger-cover,
  .detail-page .challenger-cover {
  background: url(../images/index-activity-cover.png) no-repeat;
  background-size: cover;
}

.challenger-cover {
  position: relative;
  color: #fff;
  border-radius: .2rem;
  box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.12);
}

/* .challenger-cover .bet-title {
  position: absolute;
  top: 1rem;
  left: .75rem;
  line-height: 1;
  font-size: 1.2rem;
} */
.challenger-cover .bet-title {
  position: relative;
  top: 0;
  left: 0;
  padding: .75rem;
  line-height: 1;
  font-size: .95rem;
}

.challenger-cover .deadline-text {
  margin-top: .75rem;
  margin-bottom: .25rem;
  font-size: .7rem;
  color: #fff;
}

.challenger-cover .deadline {
  display: inline-block;
}

.challenger-cover .deadline .item {
  float: left;
  margin-right: .5rem;
  display: block;
  width: 2.2rem;
  line-height: 1;
  padding: .5rem 0;
  color: #fff;
  font-size: .6rem;
  text-align: center;
  letter-spacing: -1px;
  background: url(../images/deadline-bg.png) repeat-x;
}

.flipclock {
  background: transparents;
}

.flipclock .item {
	padding: 0 !important;
  background: none !important;
}

.flipclock .flip {
  width: auto !important;	
}

.challenger-cover .deadline .item .number {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: .25rem;
}

.challenger-cover .bet-title p {
  margin-top: .25rem;
  font-size: .75rem;
}

.challenger-cover .user-cover {
  position: absolute;
  bottom: 1rem;
  left: .75rem;
}

.challenger-cover .user-cover img {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 100%;
  border: 2px solid #fff;
}

.challenger-cover .share {
  position: absolute;
  top: 1rem;
  right: .75rem;
  font-size: .65rem;
}

.step-layout {
  padding: 0 .5rem 1rem;
}

.step-layout .step-name {
  position: relative;
  margin-top: 1rem;
  font-size: .9rem;
  color: #333333;
  font-weight: bold;
}

.step-layout .step-name:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -.5rem;
  margin-top: -.4rem;
  width: .25rem;
  height: .8rem;
  background: #d11b28;
}

.step-layout .step-content {
  font-size: .7rem;
}

.step-layout .step-content ul {
  list-style: none;
  padding-left: 0;
  color: #333333;
}

.step-layout .step-content ul span {
  margin-right: .25rem;
}

.step-layout .color-red {
  color: #ff621f;
  font-size: .9rem;
  font-weight: bold;
}

.step-layout .step-content h6 {
  margin-top: 1rem;
  margin-bottom: 0;
  font-size: .75rem;
  color: #333333;
}

.wechat-pay-button {
  position: absolute;
  left: .5rem;
  right: .5rem;
  bottom: 1rem;
  background: #d11b28;
}

.shopping-list {
  margin: .5rem;
}

.shopping-page .shopping-list .iconfont, .bet-shopping-page  .shopping-list .iconfont
  {
  padding: 0 .5rem;
  font-size: 1rem;
  /* color: #ff4e00; */
}

.bet-shopping-page  .shopping-list .iconfont {
  color: #d11b28;
}

.shopping-page .wechat-pay-button .iconfont, .bet-shopping-page  .wechat-pay-button .iconfont
  {
  color: #ffffff;
}

.shopping-page .shopping-list .item-content, .bet-shopping-page  .shopping-list .item-content
  {
  padding-left: 0;
}

.shopping-page .shopping-list .get-code, .bet-shopping-page  .shopping-list .get-code
  {
  width: 6.5rem;
  padding: .15rem;
  font-size: .7rem;
  color: #d11b28;
  text-align: center;
  border: 1px solid #d11b28;
}

.shopping-page .participant-info, .bet-shopping-page .participant-info {
  position: relative;
  padding: 2.5rem 0 .5rem;
  font-size: .9rem;
  color: #c2c0c0;
}

.bet-shopping-page .participant-info {
  padding: 1rem 0 .25rem;
}

.shopping-page .participant-info .cover, .bet-shopping-page .participant-info .cover
  {
  position: absolute;
  top: -2rem;
  left: 50%;
  margin-left: -2rem;
  display: block;
  width: 4rem;
  height: 4rem;
  border-radius: 100%;
  border: 2px solid #d11b28;
}

.bet-shopping-page .participant-info .cover {
  position: relative;
  top: 0;
  left: 0;
  margin: 0 auto;
}

.shopping-page .participant-info .name, .bet-shopping-page .participant-info .name
  {
  margin-top: .25rem;
  margin-bottom: .25rem;
  font-size: .85rem;
  color: #333;
}

.shopping-result-page .button-layout .button {
  margin: .5rem 0;
  color: #ff4e00;
  border-color: #CC2233;
}

.shopping-result-page .join-button {
  color: #ffffff !important;
  background: #CC2233;
}

.shopping-result-page .success-layout {
  margin: 3.5rem 0 4.5rem;
  font-size: .9rem;
  color: #333333;
}

.shopping-result-page .success-layout .iconfont {
  font-size: 4rem;
  color: #CC2233;
  line-height: 4.5rem;
}

.activity-share-page, .bet-share-page {
  background: url(../images/share-bg.jpg) no-repeat;
  background-size: cover;
}

.userbet-share-page {
  background: url(../images/share-bg.jpg) no-repeat;
  background-size: cover;
}

.userbet-share-page .share-cover {
	position: relative;
  margin: 2rem 1rem 0;
  padding: 2.25rem 1rem 1rem;
  background: url(../images/userbet-share-bg.png) no-repeat;
  background-size: 100% 100%;
}

.userbet-share-page .share-cover .fitbet-logo {
	position: absolute;
	left: 50%;
	top: -1.2rem;
	width: 5.8rem;
	margin-left: -2.9rem;
}

.bet-share-page .share-cover {
  position: relative;
  padding: 1rem .75rem;
  margin-top: 2rem;
  border-radius: .35rem;
  border: .15rem solid #000000;
  box-shadow: 5px -6px 0px #ff4e00;
  background: #ffffff;
}

.activity-share-page .share-cover, 
.bet-share-page .share-cover {
  margin: 1rem .75rem;
}

.activity-share-page .share-qrcode, 
.bet-share-page .share-qrcode,
.userbet-share-page  .share-qrcode {
  position: absolute;
  bottom: 1rem;
  left: 0;
  right: 0;
  font-size: .85rem;
  color: #ffffff;
}

.activity-share-page .share-qrcode .img-style, 
.bet-share-page .share-qrcode .img-style,
.userbet-share-page .share-qrcode .img-style{
  width: 4rem;
  margin: 0 auto;
}

.bet-share-page .share-cover {
  position: relative;
  padding: 1rem .75rem;
  margin-top: 2rem;
  border-radius: .35rem;
  border: .15rem solid #000000;
  box-shadow: 5px -6px 0px #ff4e00;
  background: #ffffff;
}

.bet-share-page .share-cover .fitbet-logo {
  margin: -2rem auto 1rem;
  width: 5rem;
}

.bet-share-page .share-cover .info,
.userbet-share-page .share-cover .info {
  font-size: 1.2rem;
  font-weight: bold;
  color: #000000;
}

.bet-share-page .share-cover .bonus,
.userbet-share-page .share-cover .bonus {
  margin: .5rem 0 .25rem;
  color: #d11b28;
  font-size: .6rem;
  font-weight: bold;
}

.bet-rule-page .rule-layout .main {
  position: relative;
  /*   padding-bottom: 2.2rem;
  height: 19rem; */
  overflow: hidden;
}

.bet-rule-page .rule-layout .main.show {
  height: auto;
}

.bet-rule-page .open-more {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  font-size: .65rem;
  color: #ff3a00;
  background: #eeeeee;
}
/*
 * =================================
 *  profile old style
 * =================================
 */
.profile-page .user-info {
  position: relative;
  margin: 1rem .5rem .5rem;
  padding: .5rem;
  color: #333333;
  border-radius: .5rem;
  background: #fff;
}

.profile-page .user-cover {
  display: block;
  float: left;
  margin-right: .5rem;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 100%;
}

.profile-page .user-cover img {
  border-radius: 100%;
}

.profile-page .info .username {
  margin-top: .25rem;
  font-size: .95rem;
}

.profile-page .info .phone {
  font-size: .75rem;
  color: #666666;
}

.profile-page .list-block {
  margin: .5rem;
}

.profile-page .list-block .item-content {
  padding-left: .5rem;
  margin-bottom: .5rem;
  border-radius: .5rem;
  background: #fff;
}

.profile-page .list-block .item-inner {
  min-height: 3.75rem;
}

.profile-page .list-block .item-title {
  font-size: .7rem;
  color: #333;
}

.profile-page .item-content .price {
  line-height: 1;
  font-size: 1.8rem;
  color: #333;
}

.profile-page .profile-footer {
  position: absolute;
  bottom: 1rem;
  left: 0;
  right: 0;
  color: #ff4e00;
}

.profile-page .profile-footer a {
  padding: 0 .5rem;
  font-size: .7rem;
  color: #d11b28;
}

.profile-page .profile-footer .iconfont {
  margin-right: .25rem;
  font-size: 1.1rem;
  vertical-align: middle;
}

/* end */
.withdrawal-page .user-header {
  padding: 1.5rem 1rem 3rem;
  margin: .5rem 0 0;
  color: #fff;
  background: #d11b28;
}

.withdrawal-page .user-cover {
  display: block;
  float: left;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 100%;
  border: 2px solid #fff;
}

.withdrawal-page .user-cover img {
  border-radius: 100%;
}

.withdrawal-page .balance {
  float: left;
  margin-left: .75rem;
  font-size: .75rem;
}

.withdrawal-page .draw-money {
  margin: -1.5rem .5rem 0;
  padding: 1rem 1rem .5rem;
  background: #fff;
}

.withdrawal-page .draw-money input {
  margin: .25rem 0;
  width: 100%;
  font-size: 2.4rem;
  border-color: transparent;
}

.withdrawal-page .draw-money input::-webkit-input-placeholder {
  color: #c2c2c2;
}

.draw-modal .modal-inner, .draw-modal .modal-button {
  background: #fff;
}

.draw-modal .modal-title {
  padding-top: .5rem;
  font-size: .7rem;
}

.draw-modal .price-layout {
  margin: 0;
  font-size: .8rem;
  color: #333;
}

.draw-modal .price {
  font-size: 2rem;
}

.draw-modal .modal-button {
  font-size: .7rem;
  color: #999999;
}

.draw-modal .modal-button:first-child {
  color: #ff4e00;
}

.bill-page .bill-list {
  margin: 1rem .5rem;
}

.bill-page .bill-list .item-content {
  margin: .25rem 0;
  background: #fff;
}

.bill-page .bill-list .item-inner {
  padding-top: .5rem;
  padding-bottom: .45rem;
}

.bill-page .draw-name {
  margin-bottom: .25rem;
  font-size: .9rem;
  color: #333;
}

.bill-page .inner {
  font-size: .7rem;
  color: #666;
}

.bill-page .item-after {
  color: #ff4e00;
  font-size: .75rem;
}

.bill-page .inner i {
  margin-right: .25rem;
}

.bill-page .inner .iconfont {
  font-size: .6rem;
}

.red-circular {
  display: inline-block;
  width: .55rem;
  height: .55rem;
  border-radius: 100%;
  background: #d11b28;
}

.landing-cover {
  margin: 0 .25rem;
  padding: .75rem 1rem 1rem;
  position: relative;
  color: #fff;
  font-size: 1rem;
  border-radius: .25rem;
  background: url(../images/landing-cover.png) no-repeat;
  background-size: cover;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.2);
}

.landing-cover p {
  margin: 0;
}

.landing-cover .date {
  list-style: none;
  padding-left: 0;
  margin: .25rem 0 0;
}

.landing-cover .date li {
  display: block;
  float: left;
  width: 1rem;
  height: 1rem;
  line-height: 1rem;
  color: #333333;
  font-size: .75rem;
  font-weight: 500;
  text-align: center;
  margin-right: .25rem;
  background: #fff;
}

.landing-cover .phase {
  position: absolute;
  bottom: 1rem;
  right: .75rem;
  padding: 2px 3px;
  color: #fff;
  font-size: .7rem;
  border-radius: .2rem;
  border: 1px solid #fff;
}

.landing-cover .phase-btn {
	display: inline-block;
	padding: .25rem 1rem;
	margin-top: 1rem;
  font-size: .8rem;
  font-weight: bold;
  color: #fff;
  border-radius: 1rem;
  background: #d11b28;
}

.landing-page .has-img-header:after, .activity-page .has-img-header:after
  {
  background: transparent;
}

.landing-page .discover {
  margin: 1rem 0 .5rem .25rem;
  padding: 0 0 .5rem .2rem;
  color: #fff;
  font-size: 1rem;
  font-weight: bold;
  border-bottom: 1px solid #666;
}

.landing-page .item-box {
	padding: 0 .5rem;
	border-bottom: 1px solid #666;
	margin-bottom: .5rem;
}

.landing-page .item-row {
	position: relative;
}

.landing-page .item-row .cover {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 3.5rem;
	border-radius: 100%;
}

.landing-page .item-row .cover img {
	border-radius: 100%;
	border: 1px solid #d11b28;
}

.landing-page .item-row .cover .number {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0;
	padding: 0 .1rem;
	color: #d11b28;
	font-size: .6rem;
	text-align: center;
	border-radius: .5rem;
	background: #fff;
}

.landing-page .item-row .innner {
	padding: .15rem 0 0 4rem;
	color: #fff;
}

.landing-page .item-row .date,
.landing-page .item-row .date .iconfont {
	font-size: .6rem;
	color: #999;
}

.landing-page .item-bonus {
	margin-top: .75rem;
	color: #fff;
	font-size: .6rem;
}

.landing-page .item-bonus .button {
  display: inline-block;
  width: 5rem;
  color: #fff;
  border-radius: 2.2rem;
  background: #e32936;
  border-color: #e32936;
}

.landing-page .item-bonus .price-icon {
	display:inline-block;
	margin-right: .25rem;
	width: 1rem;
	height: 1rem;
	color: #d11b28;
	font-size: .7rem;
	text-align: center;
	border-radius: 100%;
	border: 1px solid #d11b28;
}
/* .landing-page .item-box .item-media {
  position: relative;
  width: 5.5rem;
}

.landing-page .item-box .item-media .number {
  position: absolute;
  bottom: .5rem;
  right: .5rem;
  color: #fff;
  font-size: .65rem;
}

.landing-page .item-box .item-content {
  padding-left: .5rem;
}

.landing-page .discover-list .item-box {
  position: relative;
  margin-bottom: .5rem;
}

.landing-page .discover-list .item-box::after {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: #666;
}

.landing-page .discover-list .item-box .item-inner::after {
  background: transparent;
}

.landing-page .item-box .item-title {
  color: #d11b28;
  font-size: .95rem;
  font-weight: bold;
}

.landing-page .item-box .activity-time {
  line-height: 1;
  font-size: .75rem;
  color: #fff;
}

.landing-page .item-box .price {
  margin: .5rem 0 1rem;
  font-size: .65rem;
  color: #fff;
}

.landing-page .item-box .price>text {
  margin-left: .25rem;
  font-size: .95rem;
  font-weight: bold;
}

.landing-page .item-box .button {
  display: inline-block;
  width: 5rem;
  color: #fff;
  border-radius: 2.2rem;
  background: #e32936;
  border-color: #e32936;
} */

.landing-page .discover-list .item {
  margin-bottom: .5rem;
}

.landing-page .discover-list .cover-main img {
  border-top-left-radius: .25rem;
  border-top-right-radius: .25rem;
  display: block;
  width: 100%;
}

.landing-page .discover-list .description {
  padding: .25rem .15rem;
  color: #333;
  font-size: .8rem;
  border-bottom-left-radius: .25rem;
  border-bottom-right-radius: .25rem;
  background: #fff;
}

.discover-list .description .subtitle {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.discover-list .description .number {
  margin-top: .25rem;
  font-size: .6rem;
  color: #666;
}

.challenger-info .item-input {
  position: relative;
  margin: .25rem 0;
}

.challenger-info .item-input input {
  width: 100%;
  padding: .25rem;
  height: 2.2rem;
  font-size: .7rem;
  border-color: transparent;
  background: #fff;
}

.challenger-info .item-input .video-button {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: .25rem;
  line-height: 1.7rem;
  font-size: .7rem;
  color: #d11b28;
  background: #fff;
}

.challenger-info .tips {
	margin-bottom: 1rem;
  color: #666666;
  font-size: .7rem;
}

.vedio-upload-page .button-layout {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.vedio-upload-page .button-layout .button {
  color: #ff4e00;
  border-radius: 0;
  border: 1px solid transparent;
  border-top: 1px solid #ff4e00;
}

.vedio-upload-page .button-layout .upload-button {
  color: #fff;
  background: #ff4e00;
}

.activity-list-page .activity-list {
  margin-top: 1rem;
}

.activity-list-page .activity-list .item-media {
  position: relative;
  padding-top: 0;
  padding-bottom: 0;
}

.activity-list-page .activity-list ul:before {
  background-color: transparent;
}

.activity-list-page .activity-list .item-content {
  padding-left: 0;
}

.activity-list-page .activity-list .item-inner {
  padding-right: 0;
}

.activity-list-page .activity-list .name {
  line-height: 1;
  font-size: .85rem;
  font-weight: bold;
  color: #333;
}

.activity-list .time {
  margin-top: .2rem;
  color: #666;
  font-size: .6rem;
}

.activity-list .item-subtitle {
  margin: .25rem 0 .5rem;
}

.activity-list .item-text {
  height: auto;
}

.activity-list .number, .activity-list .bonus {
  display: inline-block;
  padding-left: .5rem;
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
}

.activity-list .number p, .activity-list .bonus p {
  margin: 0;
  line-height: 1;
  color: #666;
  font-size: .6rem;
  font-weight: 500;
}

.activity-list .number {
  padding-left: 0;
  padding-right: 1rem;
  border-right: 1px solid #999;
}

.activity-list .item-completed .item-bonus {
  
}

.activity-list .item-completed .name, .activity-list .item-completed .number,
  .activity-list .item-completed .bonus {
  color: #666666;
}

.activity-list .support-label {
  position: relative;
  display: inline-block;
  width: 5rem;
  height: 1.3rem;
  line-height: 1.3rem;
  color: #fff;
  font-size: .6rem;
  text-align: center;
  border-radius: 2rem;
  background: #d11b28;
}

.activity-list .support-label.active:after {
  position: absolute;
  content: "";
  top: 50%;
  left: .35rem;
  margin-top: -.125rem;
  width: .25rem;
  height: .25rem;
  border-radius: 100%;
  background: #fff;
}

.activity-list .nonsupport-label {
  background: #000;
}

.activity-list .item-completed .support-label {
  background: #666666;
}

.activity-list .support-label span {
  margin-left: .25rem;
}

.activity-list .completed-label {
  padding: 1px 2px;
  margin-left: .25rem;
  font-size: .6rem;
  font-weight: 500;
  color: #fff;
  background: #666;
  border-radius: .25rem;
}

.activity-list .win-cover {
  position: absolute;
  top: 10%;
  left: 10%;
  width: 80%;
}

.modal.verfy-modal {
  background-color: #fff;
}

.modal.verfy-modal .modal-inner {
  padding: .5rem;
}

.modal.verfy-modal .modal-text {
  padding: .3rem 0;
}

.code-grid {
  display: inline-block;
  width: 1.6rem;
  height: 1.6rem;
  text-align: center;
  line-height: 1.6rem;
  margin: 0 .2rem;
}

.verfy-error {
  color: #f6383a;
  font-size: .7rem;
  padding-bottom: .2rem;
}

.file-input-wrapper {
  width: 100%;
  height: 2.4rem;
  overflow: hidden;
  position: relative;
}

.file-input-wrapper>input[type="file"] {
  font-size: 200px;
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0;
}

.file-input-wrapper:hover>.btn-file-input {
  background-color: #aaa;
}

.file-input-wrapper>.btn-file-input {
  width: 100%;
}

.slider-ruler {
	padding: 10px 0 0;
  background: #fff;
  border: 1px solid #ddd;
}

.slider-ruler .rulerbox {
  position: relative;
}

.slider-ruler  .rulerbox::before {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  content: '';
  width: 3px;
  height: 35px;
 background-color: #cd2233;
}

.slider-ruler .rulerCanvas {
  display: block;
  margin: 0 auto;
  transition-duration: 300ms;
}

.example-video {
  width: auto;
  left: 1rem;
  right: 1rem;
  margin-left: 0;
}

.example-video .modal-button {
	color: #CD2233 ;
}

